<template>
	<!--pages/extend/index.wxml-->
	<view>
		<cu-custom :bgColor="'bg-'+theme.backgroundColor" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">处方信息</block>
		</cu-custom>
<view class="cu-card">
	<navigator url="/pages/users/order-disease-people/index">
	  <view  class="cu-item cu-bar bg-white" style="display:flex;padding:20rpx;30rpx">
		<text class="text-black">用药人</text>
		<view>
		  <text >{{userObj.name?userObj.name : '选择用药人'}}</text>
		  <text >{{name}}</text>
		  <text class="cuIcon-right margin-right-sm"></text>
		</view>
	  </view>
  </navigator>
</view>
<view class="cu-card">
  <view class="cu-item bg-white prescrip">
    <view class="prescrip-text">
      <text class="text-black">线下已确诊疾病</text>
      <text>(用于医生诊断开方)</text>
    </view>
   <view class="all-disease flex">
	         <text @tap="checkEase"  :id='index' v-for="(item,index) in diseaseList" :class="item.flag?'bg-red text-white border-red':''" :key='index'>{{item.num}}</text>
    </view>
    <view  @tap="openDisease" class="disease-btn">
      <text>+</text>
      <text>添加疾病</text>
    </view>
    <view class="push-img">
      <view class="text-black">补充已就诊信息 (选填)</view>
      <view>如病例/出院记录等</view>
      <view class="add-img-arr">
        <view class="img-arr" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
          <image :src="imgList[index]"></image>
          <text  class="cuIcon-close text-white bg-black close-btn" @tap.stop="DelImg"></text>
        </view>
		

		
        <view  class="cuIcon-add add-img" @tap="ChooseImage"></view>
      </view>
	  
    </view>
  </view>
</view>


<view  class="cu-modal bottom-modal " :class="diseaseShow">
  <view catchtap="true" class="disease-list cu-dialog">
    <view class="model-title">
      <text class="text-black">请确认已确诊疾病</text>
      <text @tap="closeDisease" class="cuIcon-roundclose text-black"></text>
    </view>
    <view class="search-form round bg-gray">
      <text class="cuIcon-search"></text>
      <input bindblur="setDiseaseTxt" :value="disease_text" type="text" placeholder="请输入线下确诊疾病名称查询"></input>
    </view>
    <scroll-view class="list-disease" scroll-y>
      <view v-if="diseaseList.length">
        <view @tap="setEase" :data-name='item' class="has-data overflow" v-for="(item,index) in diseaseList">{{item.num}}</view>
      </view>
      <view v-if="" class="no-data text-black">
        <view>无<text>{{disease_text}}</text>所匹配的疾病</view>
        <view>请更换名称试试</view>
      </view>
    </scroll-view>
  </view>
</view>




<view style="height:140rpx"></view>
<view class="add-btn" @tap="submit">
  <view class="add-btn_box">保存并同意问诊</view>
</view>
	
		</view>
</template>

<script>

	const app = getApp();
	import api from 'utils/api'
	export default {
		data() {
			return {
				theme: app.globalData.theme, //全局颜色变量
				imgList: [],
				diseaseShow:'',
				diseaseList:[{num:1,flag:false},
				{num:2,flag:false},
				{num:3,flag:false},
				{num:4,flag:false},
				{num:5,flag:false},
				{num:6,flag:false},
				{num:7,flag:false},
				{num:8,flag:false},
				{num:9,flag:false},
				{num:10,flag:false},
				{num:11,flag:false},
				{num:12,flag:false},
				{num:13,flag:false},
				{num:14,flag:false},
				{num:15,flag:false},
				{num:16,flag:false},
				{num:17,flag:false},
				{num:18,flag:false},
				{num:19,flag:false},
				],
				checkBtn:false,
				userObj:{},
				spuIds:[],
				peopleData:{}
			};
		},
		onLoad(options) {
			console.log(options,'我是options')
			console.log(options.spuIds,'我是options')
			this.spuIds.push(options.spuIds)
			console.log(this.spuIds,'spuIds')
			
		},
		mounted() {
			api.getGoodsDiseases({
				spuIds:this.spuIds
			}).then(res =>{
				console.log(res,'我是疾病')
			})
		},
		methods:{
			submit(){
				console.log('909090')
				// api
				console.log(this.userObj.id,'wosh用药热')
				api.putPatientPeople({
					id: this.peopleData.id,
					userId: this.peopleData.userId,
					phone: this.peopleData.mobile,
					name: this.peopleData.name,
					idCard: this.peopleData.idCard,
					sex: this.peopleData.sex,
					weight: this.peopleData.weight,
					caseHistory: this.peopleData.caseHistory,
					allergies: this.peopleData.allergies,
					familyCase: this.peopleData.familyCase,
					liverAbnormal: this.peopleData.liverAbnormal,
					kidneyAbnormal: this.peopleData.kidneyAbnormal,
					disease:['肾','肝']
				}).then(res => {
					if (res.code == 0) {
						uni.showToast({
							title: '修改成功',
							duration: 2000,
							icon: "none",
						})
						var pages = getCurrentPages(); // 获取页面栈
						var currPage = pages[pages.length - 1]; // 当前页面
						var prevPage = pages[pages.length - 2]; // 上一个页面
						prevPage.$vm.setUserId(this.peopleData.id); 
						uni.navigateBack({
							delta: 1
						})
					}
				})
			},
			setUserInfo(obj) {
				this.userObj = obj
				api.getPatientPeople(this.userObj.id).then(res =>{
					this.peopleData = res.data
					console.log(res,'查询用药人')
					console.log(this.peopleData,'this.peopleData')
				})
			},
			checkEase(e){
				this.diseaseList[e.currentTarget.id].flag = !this.diseaseList[e.currentTarget.id].flag
			},
			setEase(e){

				this.diseaseList.push({num:e.target.dataset.name.num,flag:true})
				this.diseaseShow = ''
			},
			openDisease(){//开启弹框
				this.diseaseShow = 'show'
			},
			closeDisease(){//关闭弹框
				this.diseaseShow = ''
			},
			  ChooseImage() {
			
			    let that = this;
			    uni.chooseImage({
			      success(res) {
			        const tempFilePaths = res.tempFilePaths
			
			        if (that.imgList.length != 0) {
			            that.imgList = that.imgList.concat(res.tempFilePaths)
			
			        } else {
			            that.imgList = res.tempFilePaths
			
			        }
			
			
			        // wx.uploadFile({
			        //   url: 'https://example.weixin.qq.com/upload', //仅为示例，非真实的接口地址
			        //   filePath: tempFilePaths[0],
			        //   name: 'file',
			        //   formData: {
			        //     'user': 'test'
			        //   },
			        //   success(res) {
			        //     const data = res.data
			        //     //do something
			        //   }
			        // })
			      }
			    })
			
			  },
			  ViewImage(e) {
			    uni.previewImage({
			      current: e.currentTarget.dataset.url,
			      urls: this.imgList
			    })
			  },
			  DelImg(e) {
			    this.imgList.splice(e.currentTarget.dataset.index, 1)
			      this.imgList =  this.imgList
			
			  },
		}

	}
</script>

<style scoped lang="scss">
.prescrip{
  padding: 30rpx;
}
.prescrip-text>text:nth-child(1){
  font-size: 30rpx;
  font-weight: bold;
}
.prescrip-text>text:nth-child(2){
  font-size: 24rpx;
  margin-left: 20rpx;
}
.disease-btn{
  display: flex;
  width: 160rpx;
  height: 50rpx;
  border-radius: 10000rpx;
  border:4rpx solid var(--red);
  align-items: center;
  font-size: 22rpx;
  overflow: hidden;
  line-height: 50rpx;
  text-align: center;
  margin-top: 20rpx;
  background-color: red;
}
.disease-btn>text:nth-child(1){
  color: #FFF;
  background: var(--red);
  flex-grow: 3;
  height: 100%;
  line-height: 44rpx;
}
.disease-btn>text:nth-child(2){
  color: var(--red);
  background: #FFF;
  flex-grow: 2;
  height: 100%;
}
.all-disease{
  flex-wrap: wrap;
}
.all-disease>text{
  padding:6rpx 10rpx;
  border: 2rpx solid var(--gray);
  font-size: 20rpx;
  margin-top: 20rpx;
  margin-right: 10rpx;
  border-radius: 1000rpx;
}
.push-img{
  margin-top: 20rpx;
  border-top: 2rpx solid #f1f1f1;
  padding-top: 20rpx;
}
.push-img>view:nth-child(1){
  font-size: 26rpx;
}
.push-img>view:nth-child(2){
  font-size: 22rpx;
  margin-top: 4rpx;
}
.img-arr{
  position: relative;
}
.add-img-arr{
  display: flex;
  flex-wrap: wrap;
}
.close-btn{
  position: absolute;
  right: 20rpx;
  top:20rpx;
  opacity: .6;
  width: 40rpx;
  height: 40rpx;
  text-align: center;
  line-height: 40rpx;
}
.add-img-arr image{
  width: 130rpx;
  height: 130rpx;
  margin-right: 20rpx;
  margin-top: 20rpx;
}
.add-img{
  width: 130rpx;
  height: 130rpx;
  font-size: 50rpx;
  border: 4rpx solid var(--ghostWhite);
  border-radius: 8rpx;
  line-height: 130rpx;
  text-align: center;
  box-sizing: border-box;
  margin-top: 20rpx;
}
.disease-list{
  height: 70vh;
  background: white;
  box-sizing: border-box;
  padding:30rpx;
}
.model-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: -20rpx;
}
.model-title>text:nth-child(1){
  font-size: 28rpx;
  font-weight: bold;
}
.model-title>text:nth-child(2){
  font-size: 48rpx;
  padding:20rpx;
  margin-right: -20rpx;
}
.search-form{
  display: flex;
  align-items: center;
  height: 60rpx;
  padding:0 20rpx;
  text-align: left;
}
.search-form input{
  margin-left: 10rpx;
  width: 600rpx;
}
.list-disease{
  height:calc(70vh - 220rpx);
  margin-top: 20rpx;
}
.has-data{
  height: 80rpx;
  line-height: 80rpx;
  border-bottom: 2rpx solid var(--ghostWhite);
  text-align: left;
}
.border-red{
  border:2rpx solid var(--red)!important;
}
.no-data{
  border: none!important;
}
.no-data>view>text::after,.no-data>view>text::before{
  content: '"';
  color: var(--red);
}
.no-data>view{
  border: none!important;
}
.no-data>view:nth-child(1){
  font-weight: bold;
}
.no-data>view:nth-child(2){
  color: var(--grey);
  font-size: 22rpx;
}
.add-btn{
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 120rpx;
  line-height: 120rpx;
  background-color: #FFF;
  display: flex;
  justify-content: flex-end;
}
.add-btn_box{
  background: #e53c43;
  color: white;
  font-size: 30rpx;
  text-align: center;
  width: 375rpx;
}







</style>
